<template>
    <Card>
        <p slot="title">短信发送记录</p>
        <div class="search-con search-con-top">
            <div>
                名称：
                <Input v-model="searchData.username" style="width: 200px"></Input>
                手机号：
                <Input v-model="searchData.mobile" style="width: 200px"></Input>
                时间：
                <Date-picker type="datetimerange" placeholder="选择日期和时间" style="width: 250px"
                    @on-change="timeOk"></Date-picker>
                <Button @click="search" type="primary" icon="ios-refresh" style="margin-left: 10px;">搜索</Button>
                <Button @click="reset" type="success" icon="ios-refresh" style="margin-left: 10px;">刷新</Button>
            </div>
        </div>
        <Table :columns="columns" :data="list" ref="selection" border style="margin-top: 10px;">
            <template slot-scope="{ row , index}" slot="makeSlot">
                <!-- <i-button type="primary" size="small" @click="edit(row)">编辑</i-button>
                <i-button type="error" size="small" @click="del(row.id)" style="margin-left: 20px;">删除</i-button> -->
                <!-- <i-button type="info" size="small" @click="jump(row.id)" style="margin-left: 20px;">添加分类</i-button> -->
            </template>
        </Table>
        <br>

        <Page :total="total" show-sizer show-total show-elevator @on-change="changePage" @on-page-size-change="changeSize">
        </Page>
    </Card>
</template>

<script>

export default {
    data() {
        return {
            searchData: {
                type: 0,
                page: 1,
                limit: 10
            },
            // 列表
            columns: [
                {
                    title: '用户名',
                    key: 'username',
                },
                {
                    title: '手机号',
                    key: 'mobile',
                },
                {
                    title: '验证码',
                    key: 'code',
                },
                {
                    title: '发送时间',
                    key: 'create_time',
                }
            ],
            // 数据
            list: [],
            total: 0,
            formItem: {
                id: 0,
                title: '',
                content: '',
                img: "",
                sort: ""
            },
            showAdd: false,
        }
    },
    methods: {
        timeOk(value) {
            this.searchData.start_time = value[0];
            this.searchData.end_time = value[1];
        },
        // 查询管理员信息
        getList() {
            let params = {
                ...this.searchData,
            };
            this.$axios('/admin/sms/getList', params).then(res => {
                this.list = res.data;
                this.total = res.total;
            });
        },
        search() {
            this.searchData.page = 1;
            this.getList();
        },
        reset() {
            this.searchData = {
                page: 1,
                limit: 10,
            };
            this.getList();
        },
        changePage(page) {
            this.searchData.page = page;
            this.getList();
        },
        changeSize(size) {
            this.searchData.limit = size;
            this.getList();
        },

    },
    created() {
        this.getList();
    }
}
</script>
